<template>
  <div style="height: 100%">
    <ElTabs v-model="activeName" class="project-dashboard" @tab-click="handleClick">
      <ElTabPane label="概况" name="overview">
        <div style="height: 100%;padding: 10px;">
          <iframe src="http://192.168.0.107:31503/data-dashboard/link/QLSegGF9" class="skeleton-iframe" style=""></iframe>
        </div>
      </ElTabPane>
      <ElTabPane label="研究阶段" name="stage">
        <ProjectStageView />
      </ElTabPane>
      <ElTabPane label="课题" name="topic">
        <ProjectTopicView />
      </ElTabPane>
      <ElTabPane label="变更" name="change">
       <ProjectInformationView/>
      </ElTabPane>
      <ElTabPane label="项目成员" name="member">
        <ProjectMemberView />
      </ElTabPane>
      <ElTabPane label="项目文档" name="document">
        <div style="height: 100%;padding: 10px;">
          <EmptyView empty-tips="建设中..." style="border-radius: 4px;box-shadow: var(--box-shadow)"/>
        </div>
      </ElTabPane>
      <ElTabPane label="任务" name="task">
        <ProjectTaskView/>
      </ElTabPane>
      <ElTabPane label="委托业务" name="delegate">
        <ProjectDelegateView />
      </ElTabPane>
    </ElTabs>
  </div>
</template>

<script>
  import ProjectMemberView from '@/module/tech-project/project-manage/member/ProjectMemberView.vue'
  import ProjectDelegateView from '@/module/tech-project/project-manage/delegate/ProjectDelegateView.vue'
  import ProjectStageView from '@/module/tech-project/project-manage/stage/ProjectStageView.vue'
  import ProjectTopicView from '@/module/tech-project/project-manage/topic/ProjectTopicView.vue'
  import ProjectInformationView from '@/module/tech-project/project-manage/information/ProjectInformationView.vue'
  import ProjectTaskView from '@/module/tech-project/project-manage/task/ProjectTaskView.vue'

  export default {
    name: 'ProjectsDashboard',
    components: { ProjectTaskView, ProjectInformationView, ProjectTopicView, ProjectStageView, ProjectDelegateView, ProjectMemberView },
    data() {
      return {
        activeName: 'overview'
      }
    },
    methods: {
      handleClick(tab, event) {
        console.log(tab, event)
      }
    }
  }
</script>
